<template>
  <a-table :loading="loading" :columns="columns" :data-source="data" :pagination="data.length > 10 ? pagination : false">
    <template #createByName="createByName">
      {{ createByName || '系统' }}
    </template>
    <template #eventType="eventType">
      {{ $utils.getEnumName(orderLogEventTypeEnums, eventType) }}
    </template>
    <template #eventDesc="eventDesc">
      <a-tooltip :title="eventDesc">
        <section class="overflow">{{ eventDesc }}</section>
      </a-tooltip>
    </template>
  </a-table>
</template>
<script>
import {getLogList} from '@/api/order/log'
import {tableMixins} from '@/utils/mixins'
export default {
  name: 'OrderLog',
  mixins: [tableMixins],
  props: {
    orderId: {
      type: [String, Number],
      required: true
    }
  },
  data() {
    return {
      loading: false,
      orderLogEventTypeEnums: [],
      columns: [
        {title: '操作账号', dataIndex: 'createByName', scopedSlots: {customRender: 'createByName'}},
        {title: '事件类型', dataIndex: 'eventType', scopedSlots: {customRender: 'eventType'}},
        {title: '操作时间', dataIndex: 'createTime'},
        {title: '事件详情', width: '30%', ellipsis: true, dataIndex: 'eventDesc', scopedSlots: {customRender: 'eventDesc'}}
      ],
      data: []
    }
  },
  async created() {
    this.orderLogEventTypeEnums = await this.$utils.getDictList('OrderLogEventType')
    this.$watch('orderId', orderId => {
      this.getLogData(orderId)
    }, { immediate: true })
  },
  methods: {
    getLogData(orderId) {
      this.loading = true
      getLogList({ orderId }).then(data => {
        this.data = data
        this.$emit('getCount', this.data.length)
      }).finally(() => this.loading = false)
    }
  }
}
</script>
